<template>
  <div class="va-container">
    <!-- 会员类型 -->
    <div class="flex-row " style="margin-bottom: 28px;">
      <label class="ewai">申请理事会职务*</label>
      <div class="duigou-con ">
        <el-radio v-model="vipType.councilPosition" label="N" border>无</el-radio>
        <span class="duigou" v-show="vipType.councilPosition === 'N'"><li class="duigou-inner el-icon-check"></li></span>
      </div>
      <div class="duigou-con ">
        <el-radio v-model="vipType.councilPosition" label="LS" border>理事单位</el-radio>
        <span class="duigou" v-show="vipType.councilPosition === 'LS'"><li class="duigou-inner el-icon-check"></li></span>
      </div>
      <div class="duigou-con ">
        <el-radio v-model="vipType.councilPosition" label="CWLS" border>常务理事单位</el-radio>
        <span class="duigou" v-show="vipType.councilPosition === 'CWLS'"><li class="duigou-inner el-icon-check"></li></span>
      </div>
      <div class="duigou-con ">
        <el-radio v-model="vipType.councilPosition" label="FHZDW" border>副会长单位</el-radio>
        <span class="duigou" v-show="vipType.councilPosition === 'FHZDW'"><li class="duigou-inner el-icon-check"></li></span>
      </div>
      <div class="duigou-con ">
        <el-radio v-model="vipType.councilPosition" label="CWFHZDW" border>常务副会长单位</el-radio>
        <span class="duigou" v-show="vipType.councilPosition === 'CWFHZDW'"><li class="duigou-inner el-icon-check"></li></span>
      </div>
      <div class="duigou-con ">
        <el-radio v-model="vipType.councilPosition" label="HZDW" border>会长单位</el-radio>
        <span class="duigou" v-show="vipType.councilPosition === 'HZDW'"><li class="duigou-inner el-icon-check"></li></span>
      </div>
    </div>
    <div class="textarea-con" :class="{'validate-err': errors.has('workExperience')}" v-if="vipType.councilPosition !== 'N'">
      <label data-content="职务申请人工作经历*">职务申请人工作经历*&nbsp;&nbsp;&nbsp;<span class="lg-promp">不超过600字</span></label>
      <!-- 当申请理事会职务不是 '无', 必填 -->
      <textarea  rows="4" class="width-full" v-model="vipType.workExperience" v-validate="'required|max:600'" name="workExperience"></textarea>

    </div>
    <div class="textarea-con" :class="{'validate-err': errors.has('educationalBackground')}" v-if="vipType.councilPosition !== 'N'">
      <label data-content="职务申请人学历简介*">职务申请人学历简介*&nbsp;&nbsp;&nbsp;<span class="lg-promp">不超过600字</span></label>
      <!-- 当申请理事会职务不是 '无', 必填 -->
      <textarea rows="4" class="width-full" v-model="vipType.educationalBackground" v-validate="'required|max:600'" name="educationalBackground"></textarea>
    </div>
    <!-- <div class="tc">
      <el-button type="success width-200" plain round>下一步</el-button>
    </div> -->
  </div>
</template>

<script>
  export default {
    title: '理事会职务申请信息',
    name: 'counciljob-app',
    props: {
      data: {}
    },
    data () {
      return {
        vipType: {}
      }
    },
    mounted () {
      this.vipType = Object.assign({}, this.data)
    },
    methods: {
      validate () {
        return this.$validator.validateAll()
      }
    },
    watch: {
      'vipType': {
        handler: function (val, oldVal) {
          this.$emit('update:data', this.vipType)
        },
        deep: true
      },
      'data': {
        handler: function (val, oldVal) {
          // this.$emit('update:data', this.vipType)
        },
        deep: true
      }
    }
  }
</script>
<style scoped>
  .duigou-con {
    margin-left: 12px;
  }
</style>
